/* ── Custom properties ──────────────────────────────────── */
:host {
--enviso-primary-color: #43D9EC;
--enviso-secondary-color: #111111;
--enviso-tertiary-color: #F8F3EC;
}
/* ── Card host: remove default white card look ───────────── */
:host(:has(section.enviso-offer-card)) {
background: #111111;
box-shadow: none;
border-radius: 20px;
overflow: hidden;
}
/* ── Card section: make it a positioned container ────────── */
section.enviso-offer-card {
position: relative;
display: block;
aspect-ratio: 4 / 3;
overflow: hidden;
border-radius: 20px;
}
/* ── Image container fills the full card ─────────────────── */
.enviso-offer-availability-picture {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
}
/* ── Image itself fills its container ───────────────────── */
span.enviso-offer-picture {
position: absolute;
inset: 0;
width: 100% !important;
height: 100% !important;
aspect-ratio: unset !important;
border-radius: 0;
}
/* ── Gradient overlay sits above the image ───────────────── */
.enviso-offer-availability-picture::after {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(
to top,
rgba(0, 0, 0, 0.88) 0%,
rgba(0, 0, 0, 0.45) 45%,
rgba(0, 0, 0, 0) 75%
);
pointer-events: none;
z-index: 1;
}
/* ── Text info block: pinned above the buttons ───────────── */
.enviso-offer-info {
position: absolute;
bottom: 3.25em;
left: 0;
right: 0;
padding: 0 0.85em 0.25em;
min-height: unset;
z-index: 2;
}
header.enviso-offer-name > span {
color: #ffffff;
font-size: 1.1em;
}
summary.enviso-offer-details > span {
color: rgba(255, 255, 255, 0.75);
}
p.enviso-offer-short-description > span {
color: rgba(255, 255, 255, 0.7);
}
.enviso-btn.primary {
color: #000;
}
/* ── Action buttons: pinned at the bottom ────────────────── */
nav.enviso-offer-actions {
position: absolute;
bottom: 0;
left: 0;
right: 0;
z-index: 2;
border-top: none;
padding: 0 0.75em 0.65em;
gap: 0.5em;
background: transparent;
}
nav.enviso-offer-actions > enviso-button {
color: #fff;
border: 2px solid rgba(255, 255, 255, 0.75) !important;
border-radius: 99em !important;
font-family: "Maison Neue Demi", Arial, sans-serif;
background: rgba(0, 0, 0, 0);
backdrop-filter: blur(4px);
height: 2.8em;
font-size: 0.9em;
}
/* override the separator rule so both borders are white */
nav.enviso-offer-actions > enviso-button + enviso-button {
border-left: 1.5px solid rgba(255, 255, 255, 0.75) !important;
}
/* ════════════════════════════════════════════════════════════
UPSELL / CAROUSEL CARD — mirrors the offer card treatment
════════════════════════════════════════════════════════════ */
/* ── Host: strip default card chrome ────────────────────── */
:host(:has(section.enviso-upsell-offer-card)) {
display: block;
width: 100%;
aspect-ratio: 4 / 3;
background: transparent;
box-shadow: none;
border-radius: 20px;
overflow: hidden;
}
/* ── Size the cross-sell card from its parent shadow root ── */
enviso-cross-sell-offer-card {
display: block;
width: 100%;
aspect-ratio: 4 / 3;
max-width: 350px;
}
/* ── Outer section + inner content: single stacking context ─ */
section.enviso-upsell-offer-card {
position: relative;
display: block;
aspect-ratio: 4 / 3;
overflow: hidden;
border-radius: 20px;
width: 100%;
}
.enviso-card-content {
position: absolute;
inset: 0;
display: block;
background: transparent;
box-shadow: none;
border-radius: 20px;
width: 100%;
height: 100%;
overflow: hidden;
}
/* ── Children of card-content: remove their own flex layout ─ */
.enviso-card-content > div {
display: block;
}
/* ── Image fills the card ────────────────────────────────── */
div.enviso-upsell-offer-picture {
position: absolute;
inset: 0;
width: 100% !important;
height: 100% !important;
aspect-ratio: unset !important;
background-size: cover;
background-position: center;
border-radius: 0;
}
/* ── Gradient overlay ────────────────────────────────────── */
div.enviso-upsell-offer-picture::after {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(
to top,
rgba(0, 0, 0, 0.88) 0%,
rgba(0, 0, 0, 0.45) 45%,
rgba(0, 0, 0, 0) 75%
);
pointer-events: none;
}
/* ── Title: pinned above the action row ─────────────────── */
header.enviso-offer-name {
position: absolute;
bottom: 3.25em;
left: 0;
right: 0;
margin: 0;
padding: 0 0.85em 0.25em;
z-index: 2;
}
header.enviso-offer-name > span {
color: #ffffff;
font-size: 1.1em;
}
/* ── "Meer info" pill button ─────────────────────────────── */
summary.enviso-offer-details {
z-index: 2;
display: none;
}
summary.enviso-offer-details:has(span:not(:empty)) {
display: inline-flex;
align-items: center;
justify-content: center;
height: 2.8em;
padding: 0 1.2em;
border: 2px solid rgba(255, 255, 255, 0.75);
border-radius: 99em;
background: rgba(0, 0, 0, 0);
backdrop-filter: blur(4px);
cursor: pointer;
}
summary.enviso-offer-details > span {
color: #ffffff;
font-family: "Maison Neue Demi", Arial, sans-serif;
font-size: 0.9em;
text-decoration: none;
}
/* ── Action row: pinned at the bottom ────────────────────── */
.enviso-details-container {
position: absolute;
bottom: 0;
left: 0;
right: 0;
z-index: 2;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 0 0.75em 0.65em;
background: transparent;
}
/* ── Reset the price/details child div ───────────────────── */
.enviso-details-container > div {
font-size: 1em;
margin: 0;
}
/* ── + icon: strip button chrome, show just the icon ────── */
.enviso-upsell-button {
color: #ffffff !important;
border: none !important;
border-radius: 0 !important;
background: transparent !important;
backdrop-filter: none !important;
box-shadow: none !important;
height: auto !important;
width: auto !important;
min-height: 0 !important;
min-width: 0 !important;
max-width: none !important;
font-size: 2em;
padding: 0 !important;
}
/* ── + icon internals (enviso-button shadow DOM) ─────────── */
:host(.enviso-upsell-button) {
border: none !important;
background: transparent !important;
box-shadow: none !important;
height: auto !important;
width: auto !important;
min-height: 0 !important;
min-width: 0 !important;
max-width: none !important;
padding: 0 !important;
}
:host(.enviso-upsell-button) .enviso-btn {
padding: 0 !important;
width: auto !important;
height: auto !important;
}
:host(.enviso-upsell-button) .enviso-btn.icon-only > enviso-icon {
display: block;
}
:host(.enviso-upsell-button) svg {
fill: #ffffff !important;
}
/* ════════════════════════════════════════════════════════════
CALENDAR — tweak the variables below to restyle the picker
════════════════════════════════════════════════════════════ */
:host {
/* gap between every date cell */
--cal-cell-spacing: 6px;
/* corner rounding on each cell */
--cal-cell-radius: 6px;
/* border colour of available cells */
--cal-cell-border: rgba(0, 0, 0, 0);
/* normal cell background */
--cal-cell-bg: #FFF3E8 !important;
/* disabled / past cell */
--cal-cell-disabled-bg: #f0f0f0;
--cal-cell-disabled-color: #bbbbbb;
/* today highlight colour */
--cal-today-color: #FDD6AF;
/* selected / range cell */
--cal-selected-color: #FDD6AF;
}
/* ── Calendar host: border & radius ─────────────────────── */
:host(:has(table.enviso-month)) {
border: 2px solid var(--cal-today-color);
border-radius: 16px;
overflow: hidden;
}
/* ── Separate cells with configurable gap ─────────────────── */
table.enviso-month {
border-collapse: separate;
border-spacing: var(--cal-cell-spacing);
}
/* ── Square cells
The widget ships height: 3.5em which turns cells into rectangles
once border-spacing eats into the column width.
With table-layout: fixed the browser sets all column widths first,
then aspect-ratio: 1 derives the row height from that width. ── */
.enviso-day {
aspect-ratio: 1 / 1;
}
/* ── Cell base appearance ────────────────────────────────── */
.enviso-dates .enviso-day {
border: 1px solid var(--cal-cell-border) !important;
background-color: var(--cal-cell-bg);
border-radius: var(--cal-cell-radius);
}
/* ── Hover: non-disabled cells get the accent border ────── */
.enviso-dates .enviso-day:not(.enviso-disabled):hover {
border: 2px solid var(--cal-today-color) !important;
}
/* ── State overrides ─────────────────────────────────────── */
.enviso-day.enviso-disabled {
background-color: var(--cal-cell-disabled-bg) !important;
color: var(--cal-cell-disabled-color) !important;
}
.enviso-day.enviso-today {
color: #000000 !important;
position: relative;
}
.enviso-day.enviso-today::after {
content: '';
position: absolute;
bottom: 20%;
left: 50%;
transform: translateX(-50%);
width: 4px;
height: 4px;
border-radius: 50%;
background-color: #000000 !important;
}
.enviso-dates .enviso-day.enviso-selected,
.enviso-dates .enviso-day.enviso-range-start,
.enviso-dates .enviso-day.enviso-range-end {
outline-color: var(--cal-selected-color) !important;
border-color: var(--cal-selected-color) !important;
}
.enviso-dates .enviso-day.enviso-selected {
background-color: var(--cal-selected-color) !important;
}
.enviso-dates .enviso-day.enviso-in-range {
border-color: var(--cal-selected-color) !important;
}
/* ── Timeslot buttons ─────────────────────────────────────── */
.enviso-timeslot-button {
background-color: var(--cal-cell-bg) !important;
border: 1px solid var(--cal-today-color) !important;
border-radius: var(--cal-cell-radius) !important;
color: #000000 !important;
position: relative;
}
:host([selected]) .enviso-timeslot-button {
background-color: var(--cal-today-color) !important;
}
.enviso-timeslot-button::after {
content: '';
width: 0;
height: 0;
}
/* ── Cross-sell timeslots: remove margin-left on mobile ──── */
@media (max-width: 845px) {
.enviso-cross-sell-timeslots-container {
margin-left: 0 !important;
}
}
5 reacties Commentaar van bezoekers
Dordrechtsche Courant zondag 19 augustus 1883 Een voldoend bewijs voor de verbetering der kazernen levert zeker de hier gebouwde pontonniers-kazerne, welke eerstdaags geheel tot ingebruikneming gereed zal zijn. Wij meenen daarom onzen lezers aangenaam te zijn, door hun eenige bijzonderheden dienaangaande mede te doelen. Van hooger hand werd in 1881 aan den luitenant-kolonel Bolken, genie-kommandant in het 3de genie-kommandcment alhier, last gegeven tot het ontwerpen eener pontonniers- kazerne alhier. In korten tijd was daaraan voldaan en reeds het laatst van hetzelfde jaar kon de aanbesteding daarvan uitgeschreven worden. Zooals bekend is, werden aannemers de heeren J. J. Kooijmans en A. du Vijn alhier, terwijl de leiding van het werk werd opgedragen aan den kapitein-ingenieur R. Sturms en den sedert tot lsten luitenant-ingenieur bevorderden 2den luitenant J. M. van Hoogstraten. Aan dezen en de aan hun toegevoegde burgerlijke opzigters, alsmede den opzígter van fortificatien A. Vermeeren, zoowel als aan de bouwmeesters, komt een woord van lof toe, voor de wijze waarop het geheel werd uitgevoerd. Gaan wij thans over tot eene korte beschrijving van het gebouw. Het front is om verschillende overwegende redenen aangebragt aan de Binnen-Walevest. Op den beganen grond vinden wij onmiddellijk bij den ingang eene cantine voor manschappen en eene voor onderofficieren, tevens eetzaal; vooral de eerstgenoemde munt uit door sierlijkheid en gezellige inrigting, waarin niets ontbreekt. Het buffet is smaakvol ontworpen en zal door menigen koffiehuishouden met naijver worden opgenomen. Ter linkerzijde daarvan vinden wij de woning van den adjudant-onderofficier, ter regterzijde een achttal badkamers, geheel naar de eischen des tijds van kranen voor koud en warm water voorzien. Verder zijn in den regtervleugel de polítiewacht en de verschillende arrestkamers aangebragt. Aan de linkerzijde bevindt zich de keuken, waarin twee kooktoestellen, systeem Bernard, waarmede in betrekkelijk korten tijd de geheele menage door middel van stoom wordt bereid, en die steeds uitstekend blijven voldoen. Voorts nog eenige bergplaatsen, privaten enz. Aan de rivierzijde is een open plein gelaten tot het verzamelen der troepen. Op de eerste en tweede verdieping bevinden zich op elk, vier groote zalen voor manschappen, allen voorzien van een doelmatige kagchel, benevens drie reinigingslokalen, eenige privaten enz., terwijl de regtervleugel meerendeels. voor kamers van onderofficieren is ingerigt. Alleen de kamer aan de rivierzijde dient tot bureau van den kommandant. De zolder, geheel onder beschoten kap, is mede verdeeld in kamers, die in tijd van nood, tot huisvesting van troepen kunnen dienen. Alle lokalen zijn zoo goed mogelijk verlicht en van ventilatie en luchtkleppen voorzien, terwijl door het geheele gebouw gaz- en waterleiding is aangebragt. Op verschillende plaatsen in gangen en portalen bevinden zich brandkranen met toebehooren en afsluiters. Aardig uitgedacht zijn de klappers op alle buitendeuren, de Symbolen van het korps (een haak en een roeispaan gekruist, waaraan een opgerolde tros touw) voorstellende. De algemeene indruk dien het gebouw maakt kan niet anders dan gunstig zijn, en getuigt van smaak, gepaard aan technische kennis, en getoetst aan werkelijk bestaande behoeften. Indien men daarbij in aanmerking neemt, dat de thans nog bewoonde oude kazerne geheel wordt ingerigt tot magazijnen, schoollokalen, woningen voor gehuwde militairen, enz., dan kan het niet betwist worden, dat onze stad trotsch kan zijn op eene inrigting, die tot welzijn van een groot aantal staatsburgers strekt. Vermoedelijk zal het gebouw na terugkeer der compagnie, die Maandag a. s. aan de groote manoeuvres gaat deel nemen, in dienst worden gesteld en daarbij feestelijk worden ingewijd. Naar ons wordt medegedeeld bestaat het voornemen, het gebouw eerstdaags voor het publiek ter bezigtigíng te stellen. Dordrechtsche Courant zondag 9 september 1883 De nieuwe pontonníers-kazerne alhier zal Maandag a. s betrokken worden door het gedeelte van het korps dat hier in garnizoen is gebleven. De compagnie, die deel heeft genomen aan de groote manoeuvres in Noord-Holland, en Dinsdag hier wordt terugverwacht, zal dan eveneens daar intrek nemen. Woensdag of Donderdag d. a. v. zal het nieuwe gebouw feestelijk worden ingewijd. Aan het aanvankelijk voornemen, de nieuwe kazerne voor het publiek ter bezigtiging te stellen, kon om verschillende redenen geen gevolg gegeven worden. Dordrechtsche Courant donderdag 13 september 1883 DORDRECHT, 12 September. Heden namiddag werd de nieuwe pontonniers-kazerne alhier feestelijk ingewijd. Op het plein werd door een muziekkorps eene matinee gegeven. Bij het middageten werden aan onderofficieren en minderen extra vleesch, wijn of bier en sigaren uitgereikt. Heden avond is er bal in de kazerne, waarbij aan allen bons voor vrij vertering worden verstrekt.
F. Jorissen schreef in het jaarverslag 1980 Vereniging "Oud Dordrecht": "Benthien, Busch en de bruggen over de Berezina. Over de tocht van Napoleon naar Rusland in 1812 en de inspanningen van o.a. Benthien, naamgever van de Pontonnierskazerne in Dordrecht"